<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="icon" href="./images/logo.ico">
    <link rel="stylesheet" href="./css/common.css">
    <title>首页</title>
</head>
<body>
<!--公共头部-->
<div class="headerwrap bord-bott2">
	<div class="headnav">
        <div class="headnav-cent">
            <div class="headnav-left l">
                <p class="headnav-left-download">
                    <span class="headnav-left-img"></span>
                    <span class="headnav-left-text">分享实地圈</span>
                </p>
                <p></p>
            </div>

            <div  class="headnav-right r">
                <ul class="headnav-right-ul r">
                    <li class="show pleaseLogin"><a href="./login.html" class="bordRight1c">您好，请登录</a></li>
                    <li class="hide hasLogin"><a id="username"  class="" href=""></a><span class="line"></span><a class="bordRight1c" id="loginOut" href="">退出</a></li>
                    <li class="hide"><a  class="bordRight1c" href="">返回首页</a></li>
                    <li class="my_sdq"><a class="bordRight1c" href="javascript:void(0)">我的实地圈<span class="headnav-arrow"></span></a></li>
                    <li class="my_collect"><a class="bordRight1c" href="javascript:void(0)">我的收藏</a></li>
                    <li class="down-app">
                        <span class="headnav-left-img"></span>
                        <span class="headnav-left-text">手机实地圈</span>
                        <span class="headnav-left-arrow"></span>
                        <div class="head-app-down hide">
                            <img src="./images/appcode.png" alt="">
                        </div>
                    </li>
                    <div class="clears"></div>
                </ul>

            </div>
            <div class="clears"></div>
        </div>
    </div>
    <div class="headAdvert hide">
        <div class="headAdvert-img">
            <span>X</span>
            <img src="./images/advert.png" alt="">    
        </div>
    </div>
	<div class="pubtopwrap">
		<div class="pubwrap">
			<div class="pubtopcon">
				<div class="logo"></div>
				<div class="changecity">
					<span id="currentCity" class="col333">定位中...</span>
					<a href="javascript:void(0)" class="col37c">切换城市</a>
				</div>
				<div class="pubsearch setbox_s bgfff">
					<div class="searchMenu">
						<div class="searchTab bgfff">
							<ul class="tab-ul">
								<li data-tag="1" class="bgco36">商品</li>
								<li data-tag="2" class="bgcoff">商家</li>
								<li data-tag="3" class="bgcoff">服务</li>
							</ul>
						</div>
						<i></i>
					</div>
					<input type="text" class="searchinp col333" placeholder="请输入商品名">
					<a href="javascript:void(0);" class="searcha colfff bg2fb">搜索</a>
					<div class="nearArea">
                        <ul class="l">
                            <li><a href="">肯德基</a></li>
                            <li><a href="">汤粉</a></li>
                            <li><a href="">KTV</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li><a href="">酒店</a></li>
                            <li class="clears"></li>
                        </ul>
					</div>
				 </div>
				<div class="clears"></div>
			</div>
			<div class="clears"></div>
			<div class="classifynav ">
				<span class="colfff nav_down">手机实地圈下载</span>
				<ul>
					<li data-links="index" class="link_index jump_links">
						<a href="javascript:void(0);" class="col37c">首页</a>
					</li>
					<li data-links="goods" class="link_goods jump_links">
					    <a href="javascript:void(0);" class="col333">商品</a>
					</li>
					<li data-links="shop" class="link_shop jump_links">
						<a href="javascript:void(0);" class="col333">商家</a>
					</li>
					<li data-links="service" class="link_service jump_links">
						<a href="javascript:void(0);" class="col333 ">服务</a>
					</li>
				</ul>
				<div class="nav-img hide">
				    <img src="./images/appcode.png" alt="">
				</div>
			</div>
		</div>
	</div>
	<!--下拉滚动后的搜索框-->
	<div class="rollSearch hide">
	    <div class="sear-bar">
	        <div class="bar-logo"><a href="./index.html"><img src="./images/logo.png" alt="logo"></a></div>
	        <div class="pubsearch setbox_s bgfff">
                <div class="searchMenu">
                    <div class="searchSelected">
                        <em class="col333">商品</em>
                        <i class="arrorw"></i>
                    </div>
                    <div class="searchTab bgfff">
                        <ul>
                            <li class="">商家</li>
                            <li class="">服务</li>
                        </ul>
                    </div>
                </div>
                <input type="text" class="searchinp col333" placeholder="请搜索">
                <a href="#" class="searcha colfff bg2fb">搜索</a>
            </div>
	    </div>
	</div>
</div>
    <!--首页广告&&轮播-->
<div class="index_advertSystem">
    <div class="advertSystem">
        <div class="advertS_top">
            <div class="flexslider advert_l">
                <ul class="slides">
                    <li class=""><a href="http://mp.weixin.qq.com/s?__biz=MzI2ODE4NzQyOQ==&tempkey=XWYXgUrG890nIdw8Fas7sK33lV80m0N7Xw5zADr0Rs4rV%2BIpaRsnJao5IMCjEoSDco6O3gyex5tqJy53Y8PooZ73AjhSrFv86eA8jWkbXc1jpKWqTYFMRHftORQ0hbA34pw%2FjRKrMzqVDY%2BHq%2FqBUg%3D%3D&chksm=6af2235b5d85aa4dba05c63f7bbad6c94c77b7b9d934ce4a704b283e6e583c7401a330e62499#rd" target="_blank"><img src="./images/ad11.jpg" alt=""></a></li>
                    <li class=""><a href="http://www.shidiquan.cn/joinUs.html" target="_blank"><img src="./images/ad22.jpg" alt="加入我们"></a></li>
                    <li class=""><a href="http://mp.weixin.qq.com/s?__biz=MzI2ODE4NzQyOQ==&tempkey=XWYXgUrG890nIdw8Fas7sK33lV80m0N7Xw5zADr0Rs59OEhWf%2B0O3KZzVXG6EqA1J7X7ZYNlqK7OXPJybhuu7lDpMIGgiyOZY%2FXKe7yz8oNjpKWqTYFMRHftORQ0hbA3%2B97eAGea%2BYa3eqIlIdgOpw%3D%3D&chksm=6af2235a5d85aa4ccc7d1b16922c577de2ca926facc7d7562140b581a97758c9492c7bb1249d#rd" target="_blank"><img src="./images/ad33.jpg" alt=""></a></li>
                    <li class=""><a href="http://mp.weixin.qq.com/s?__biz=MzI2ODE4NzQyOQ==&tempkey=XWYXgUrG890nIdw8Fas7sK33lV80m0N7Xw5zADr0Rs4mb9NTdTnx%2Fc1afLF07SUoudT8zt752WLaU8JR8FOIzb2%2FfxfcXyoFQM1ttx6UtB5jpKWqTYFMRHftORQ0hbA3px49IQN0pNOtmf3Lu%2B%2F%2BXw%3D%3D&chksm=6af223505d85aa46497182c403ba085696617abd27d5f781a5cf9d4624944a5778990d88999e#rd" target="_blank"><img src="./images/ad44.jpg" alt=""></a></li>
                    <li class=""><a href="http://mp.weixin.qq.com/s?__biz=MzI2ODE4NzQyOQ==&tempkey=XWYXgUrG890nIdw8Fas7sK33lV80m0N7Xw5zADr0Rs7enaqSS4VjL0SV2sDhskqyUxVOfp8k6vO0K3oE6S8etLI%2Fk7Bp0UW8EXNQHaudePNjpKWqTYFMRHftORQ0hbA3rr2bTov7bHOg28wRF6tJJA%3D%3D&chksm=6af2235f5d85aa496c45a32960b1f69d8a8daa72b411af8a967ffc94c02b79736bea95f1983b#rd" target="_blank"><img src="./images/ad55.jpg" alt=""></a></li>
                </ul>
                <div class="clears"></div>
            </div>
            <div class="advert_r">
                <ul class="ad_r_img">
                    <li><img src="./images/122.png" alt=""></li>
                    <li><img src="./images/123.png" alt=""></li>
                </ul>
            </div>
        </div>
        <div class="advertS_bottom">
            <ul clclass="advertS-ul">
                <li class="l marg_r10"><img src="./images/124.png" alt=""></li>
                <li class="l marg_r10"><img src="./images/125.png" alt=""></li>
                <li class="l marg_r10"><img src="./images/126.png" alt=""></li>
                <li class="l marg_r10"><img src="./images/127.png" alt=""></li>
                <li class="l marg_r0"><img src="./images/128.png" alt=""></li>
            </ul>
            <span class="next"></span>
            <span class="pre"></span>
            <div class="clears"></div>
        </div>
    </div>
</div>
    <!--首页商品，商家，服务内容-->
<div class="index_content">
    <div class="content">
        <!--附近商品-->
        <div class="conts cont_product">
            <h3 class="cont_head"><i></i><span class="cont_title">附近商品</span><span data-more="product" class="cont_more">查看更多 &gt;</span></h3>
            <div class="cont_body">
                <div class="cont_body_nav setbox_s l">
                    <h3 class="product_heads body_nav_head">商品分类</h3>
                    <!--商品类-->
                        <ul class="product_nav">
                        </ul>
                    <div class="product_nav_kid hide">
                       <!--商品子类-->
                        <ul class="nav_kid">
                        </ul>
                    </div>
                </div>
                <div class="cont_body_data l">
                    <ul class="productList">
                    </ul>
                </div>
                <div class="clears"></div>
            </div>
        </div>
        <div class="conts_advert">
            <img src="./images/advert.png" alt="">    
        </div>
        
        <!--附近商家-->
        <div class="conts cont_shop">
            <h3 class="cont_head"><i></i><span class="cont_title">附近商家</span><span data-more="shop" class="cont_more">查看更多 &gt;</span></h3>
            <div class="cont_body">
                <div class="cont_body_nav setbox_s l">
                    <h3 class="shop_heads body_nav_head setbox_s">商家分类</h3>
                    <!--商家类-->
                        <ul class="shop_nav">
                        </ul>
                    <div class="shop_nav_kid hide">
                        <ul class="nav_kid">
                        </ul>
                    </div>
                </div>
                <div class="cont_body_data l">
                    <ul class="shopList">
                    </ul>
                </div>
                <div class="clears"></div>
            </div>
        </div>
        <div class="conts_advert">
            <img src="./images/advert.png" alt="">    
        </div>
        <!--附近服务-->
        <div class="conts cont_service">
            <h3 class="cont_head"><i></i><span class="cont_title">附近服务</span><span data-more="service" class="cont_more">查看更多 &gt;</span></h3>
            <div class="cont_body">
                <div class="cont_body_nav setbox_s l">
                    <h3 class="service_heads body_nav_head setbox_s">服务分类</h3>
                    <!--服务类-->
                        <ul class="service_nav">
                        </ul>
                    <div class="service_nav_kid hide">
                        <ul class="nav_kid">
                        </ul>
                    </div>
                </div>
                <div class="cont_body_data l">
                    <ul class="serviceList">
                    </ul>
                </div>
                <div class="clears"></div>
            </div>
        </div>
        <div class="conts_advert">
            <img src="./images/advert.png" alt="">    
        </div>
        <!--猜你喜欢-->
        <div class="conts cont_love">
            <h3 class="cont_love_head">猜你喜欢</h3>
            <div class="cont_body">
                <div class="cont_body_data">
                    <ul class="guess_love">
                        <li class="marg_r10 l">
                            <div class="data_lable_div">
                                <span class="bgfa6">支付宝支付</span>
                                <span class="bg3bc">微信支付</span>
                            </div>
                            <img class="data_img" title="肯德基大派送优惠多快来抢购吧" src="./images/product.png" alt="">
                            <div class="pro_det"><img src="./images/renzheng.png" alt=""><span class="pro_detail_name">餐饮</span><span class="pro_det_price">￥65</span></div>
                            <div class="pro_mark">肯德基大派送优惠多快来抢购吧</div>
                            <div class="pro_detail">
                                <p>肯德基大派送优惠多快来抢购吧肯德基大派送优惠多快来抢购吧肯德基大派送优惠多快来抢购吧</p>
                            </div>
                            <div class="pro_lable">
                                <span class="bgfb4">减</span>
                                <span class="bg3bc">领</span>
                                <span class="bgfb4">折</span>
                                <span class="bg3bc">返</span>
                            </div>
                        </li>
                        <li class="marg_r10 l">
                            <div class="data_lable_div"></div>
                            <img class="data_img" title="肯德基大派送优惠多快来抢购吧" src="./images/product.png" alt="">
                            <div class="pro_det"><img src="./images/renzheng.png" alt=""><span class="pro_detail_name">餐饮</span><span class="pro_det_price">￥65</span></div>
                            <div class="pro_mark">肯德基大派送优惠多快来抢购吧</div>
                            <div class="pro_detail">
                                <p>肯德基大派送优惠多快来抢购吧肯德基大派送优惠多快来抢购吧肯德基大派送优惠多快来抢购吧</p>
                            </div>
                            <div class="pro_lable">
                                <span class="bgfb4">减</span>
                                <span class="bg3bc">领</span>
                                <span class="bgfb4">折</span>
                                <span class="bg3bc">返</span>
                            </div>
                        </li>
                        <li class="marg_r10 l">
                            <div class="data_lable_div"></div>
                            <img class="data_img" title="肯德基大派送优惠多快来抢购吧" src="./images/product.png" alt="">
                            <div class="pro_det"><img src="./images/renzheng.png" alt=""><span class="pro_detail_name">餐饮</span><span class="pro_det_price">￥65</span></div>
                            <div class="pro_mark">肯德基大派送优惠多快来抢购吧</div>
                            <div class="pro_detail">
                                <p>肯德基大派送优惠多快来抢购吧肯德基大派送优惠多快来抢购吧肯德基大派送优惠多快来抢购吧</p>
                            </div>
                            <div class="pro_lable">
                                <span class="bgfb4">减</span>
                                <span class="bg3bc">领</span>
                                <span class="bgfb4">折</span>
                                <span class="bg3bc">返</span>
                            </div>
                        </li>
                        <li class="marg_r10 l">
                            <div class="data_lable_div"></div>
                            <img class="data_img" title="肯德基大派送优惠多快来抢购吧" src="./images/product.png" alt="">
                            <div class="pro_det"><img src="./images/renzheng.png" alt=""><span class="pro_detail_name">餐饮</span><span class="pro_det_price">￥65</span></div>
                            <div class="pro_mark">肯德基大派送优惠多快来抢购吧</div>
                            <div class="pro_detail">
                                <p>肯德基大派送优惠多快来抢购吧肯德基大派送优惠多快来抢购吧肯德基大派送优惠多快来抢购吧</p>
                            </div>
                            <div class="pro_lable">
                                <span class="bgfb4">减</span>
                                <span class="bg3bc">领</span>
                                <span class="bgfb4">折</span>
                                <span class="bg3bc">返</span>
                            </div>
                        </li>
                        <li class="marg_l0 l">
                            <div class="data_lable_div"></div>
                            <img class="data_img" title="肯德基大派送优惠多快来抢购吧" src="./images/product.png" data-img="" alt="">
                            <div class="pro_det"><img src="./images/renzheng.png" alt=""><span class="pro_detail_name">餐饮</span><span class="pro_det_price">￥65</span></div>
                            <div class="pro_mark">肯德基大派送优惠多快来抢购吧</div>
                            <div class="pro_detail">
                                <p>肯德基大派送优惠多快来抢购吧肯德基大派送优惠多快来抢购吧肯德基大派送优惠多快来抢购吧</p>
                            </div>
                            <div class="pro_lable">
                                <span class="bgfb4">减</span>
                                <span class="bg3bc">领</span>
                                <span class="bgfb4">折</span>
                                <span class="bg3bc">返</span>
                            </div>
                        </li>
                    </ul>
                    <div class="clears"></div>
                </div>
            </div>
        </div>
        </div>
    </div>
    <!--底部-->
<div class="index_footer">
    <div id="zwl-footer">
        <div class="detail ">
            <ul class="detail-ul">
                <li class="detail-li1">
                    <div class="detail-div3">
                        <p class="detail-div-head text-left">用户帮助</p>
                        <a href="#" class="detail-div-son son1">常见问题</a>
                    </div>
                </li>
                <li class="detail-li">
                    <div class="detail-div">
                        <p class="detail-div-head text-right">手机实地圈</p>
                        <a href="#" class="detail-div-son">下载手机版</a>
                    </div>
                </li>
                <li class="detail-li">
                    <div class="detail-div1">
                        <p class="detail-div-head text-right">商户合作</p>
                        <a href="#" class="detail-div-son">友情链接</a>
                        <a href="#" class="detail-div-son">市场合作</a>
                    </div>
                </li>
                <li class="detail-li">
                    <div class="detail-div1">
                        <p class="detail-div-head text-right">公司信息</p>
                        <a href="#" class="detail-div-son text-right">关于实地圈</a>
                        <a href="#" class="detail-div-son text-right">微信公众号</a>
                        <a href="#" class="detail-div-son text-right">新浪微博</a>
                    </div>
                </li>
                <li class="detail-li1 detail-li2">
                    <div>
                        <div class="detail-div2">
                        <p class="detail-div-head text-right head2">联系方式</p>
                        <a href="#" class="detail-div-son text-right">电话：400-886-7938</a>
                        <a href="#" class="detail-div-son text-right">周一至周日:</a>
                        <a href="#" class="detail-div-son text-right">9:00-22:00</a>
                    </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <div class="log">
            ©2016 shidiquan.cn  京ICP证030173号  京公网安备11010802014106号  互联网药品信息
        </div>

</div>
    <!--侧边栏选项-->
<div class="index_side">
    <div class="s_div s_back_top">
        <p class="s_wid_back hide">
            <i>回到顶部</i>
            <span></span>
        </p>
        <span class="s_bg s_bg_back hide">
            <span></span>
            <i>
                返回  
                顶部
            </i>
        </span>
    </div>
    <div class="s_div s_down">
        <p class="s_wid_down hide">
           <span>扫描二维码</span>
            <img src="./images/appcode.png" alt="">
        </p>
        <span class="s_bg s_bg_down">
            <span></span>
            <i>
               下载
               app
            </i>
        </span>
    </div>
</div>
</body>
<script src="./js/jquery-1.7.2.min.js"></script>
<script src="./js/common.js"></script>
<script src="./js/jquery.lazyload.js"></script>
<script src="./js/page/index.js"></script>
<script src="./js/jquery.flexslider-min.js"></script>
<script src="./js/jumpPage.js"></script>
<script>
$(function() {
    $(".flexslider").flexslider({
		slideshowSpeed: 3000, //展示时间间隔ms
		animationSpeed: 400, //滚动时间ms
		touch: true, //是否支持触屏滑动
        slideshow:true
	});
    $(".classifynav").find(".nav_down").on({
        mouseover:function(){
            $(".nav-img").slideDown(200);
        },
        mouseout:function(){
            $(".nav-img").slideUp(200);    
        }
    });
    $(".down-app").on({
        mouseover:function(){
            $(".head-app-down").show();    
        },
        mouseout:function(){
            $(".head-app-down").hide();    
        }
    });
    var left=0;
    var flag=0;
    var defL=120;
    var len=$(".advertS_bottom ul li ").length;
    var width=parseInt($(".advertS_bottom ul li ").css("width"));
    var allWidth=len*parseInt(width)+10*(len-1);
    $(".advertS_bottom ul").css("width",allWidth);
    $(".pre").on("click",function(){
        if(left<0){
            left+=defL;
            $(".advertS_bottom ul").css("left",left);
        }
    });
    $(".next").on("click",function(){
        if((1200-left)<allWidth-width-defL){
            left-=defL;
            $(".advertS_bottom ul").css("left",left);
        }
        console.log(allWidth);
        console.log(left);
    });
    $(".headAdvert-img").find("span").on("click",function(){
        $(this).parents(".headAdvert").remove();    
    });
    //多行文本溢出的时候，在其后添加...
    $(".cont_shop").find(".pro_detail").each(function(i){
        var divH = $(this).height();
        var $p = $("p", $(this)).eq(0);
        console.log(divH);
        while ($p.outerHeight()>divH){
            $p.text($p.text().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, "..."));
        };
    });
    
    //搜索框搜索事件
    $(".searchinp").on("input",function(){
        console.log("当前文本框中的内容为:"+$(this).val());
    });
    
    
});	
</script>
</html>